<template>
	<view style="background: #f2f2f2;height: 100vh;padding: 130rpx 30rpx 30rpx 30rpx;">
		<view class=""
			style="display: flex;justify-content: center;align-items: center;flex-direction: column;background: #fff;padding: 80rpx 20rpx 50rpx 20rpx;border-radius: 30rpx;position: relative;">
			<image :src="info.app.cdnurl+userInfos.avatar" mode="widthFix"
				style="width: 100rpx;height: 100rpx;position: absolute;z-index: 9999;top: -50rpx;border-radius: 50%;">
			</image>
			<view class="" style="font-weight: bold;">{{userInfos.nickname}}</view>
			<image :src="url" mode="widthFix" style="width: 300rpx;height: 300rpx;margin-top: 30rpx;"></image>
		</view>
		<view class="" style="display: flex;justify-content: space-around;margin-top: 50rpx;">
			<view class="" style="display: flex;justify-content: center;align-items: center;flex-direction: column;">

				<button open-type="share" style="background: none;padding: 0;display: flex;justify-content: center;align-items: center;flex-direction: column;">
					<view class=""style="background: #fff;width: 80rpx;height: 80rpx;border-radius: 50%;display: flex;justify-content: center;align-items: center;">
						<text class="tn-icon-share-square"></text>
					</view>
					<text class="" style="color: #666;font-size: 28rpx;margin-top: 20rpx;display: inline;height: 37rpx;line-height: 37rpx;">分享到微信</text>
				</button>
			</view>
			<view class="" style="display: flex;justify-content: center;align-items: center;flex-direction: column;"
				@click="downBtn">
				<view class=""
					style="background: #fff;width: 80rpx;height: 80rpx;border-radius: 50%;display: flex;justify-content: center;align-items: center;">
					<text class="tn-icon-down-arrow"></text>
				</view>
				<view class="" style="color: #666;font-size: 28rpx;margin-top: 20rpx;">保存到相册</view>
			</view>
		<!-- 	<view class="" style="display: flex;justify-content: center;align-items: center;flex-direction: column;">
				<view class=""
					style="background: #fff;width: 80rpx;height: 80rpx;border-radius: 50%;display: flex;justify-content: center;align-items: center;">
					<text class="tn-icon-scan"></text>
				</view>
				<view class="" style="color: #666;font-size: 28rpx;margin-top: 20rpx;">扫一扫</view>
			</view> -->

		</view>
	</view>
</template>

<script>
	import {
		shartInfo
	} from "@/util/share.js"
	export default {
		data() {
			return {
				url: ''
			}
		},
		onShareAppMessage(res) {
			if (res.from === 'button') { // 来自页面内分享按钮
				console.log(res.target)
			}
			return {
				provider: "weixin",
				scene: "WXSceneSession",
				type: 2,
				imageUrl: this.url,
				success: function(res) {
					console.log("success:" + JSON.stringify(res));
				},
				fail: function(err) {
					console.log("fail:" + JSON.stringify(err));
				}
			}
		},
		onLoad() {
			uni.setNavigationBarTitle({
				title: '我的二维码'
			})
			let _this = this
			let res = shartInfo()
			let str = `/pages/index/index?${res.query}`
			let paths = {
				"path": str
			}
			const encodePath = encodeURIComponent(JSON.stringify(paths))
			let url =
				`https://www.taoding1688.com/addons/shop/third.wechat/wxacode?platform=miniProgram&payload=${encodePath}`
			this.url = url
		},

		methods: {
			downBtn() {
				uni.showLoading({
					title: '保存中'
				})
				//下载图片
				uni.downloadFile({
					url: this.url,
					success: (res) => {
						if (res.statusCode === 200) {
							//鉴权
							uni.authorize({
								scope: 'scope.writePhotosAlbum',
								success: () => {
									//保存图片到相册
									uni.saveImageToPhotosAlbum({
										filePath: res.tempFilePath,
										success: () => {
											uni.showToast({
												title: '保存成功'
											})
										},
										fail: (err) => {
											//取消不为错，h5端可能有这个问题
											if (err.errMsg.includes('fail cancel')) {
												uni.hideLoading()
												return
											}
											uni.showToast({
												title: '保存失败',
												icon: "error"
											})
										}
									});
								},
								fail: () => {
									// 鉴权失败手动打开
									uni.hideLoading();
									uni.showModal({
										title: '提示',
										content: '需要保存图片权限，请在设置中打开',
										showCancel: false,
										success: uni.openSetting
									});
								}
							});

						}
					},
					fail: (err) => {
						// 地址有误处理
						uni.showToast({
							title: '图片解析失败',
							icon: 'error'
						})
					}
				});
			},
		}
	}
</script>

<style lang="scss" scoped>
	.tui-btn-box {
		padding: 40rpx 30rpx 10rpx 30rpx;
		box-sizing: border-box;
		width: 100%;
	}
</style>